<link rel="stylesheet" href="<%= basePath%>/lib/sui.min.css">
<link rel="stylesheet" href="<%= basePath%>/lib/sui-append.min.css">
<link rel="stylesheet" href="<%= basePath%>/public/iconfont/iconfont.css">
<link rel="stylesheet" href="<%= basePath%>/public/css/style.css">
<link rel="stylesheet" href="<%= basePath%>/public/css/reset.css">
<link rel="stylesheet" href="<%= basePath%>/modules/leader/css/style.css">

<script type="application/javascript" src="<%= basePath%>/lib/jquery.min.js"></script>
<script type="application/javascript" src="<%= basePath%>/lib/sui.min.js"></script>
<script type="application/javascript" src="<%= basePath%>/lib/underscore-min.js"></script>
<script type="application/javascript" src="<%= basePath%>/public/js/util.js"></script>
<script type="application/javascript" src="<%= basePath%>/public/js/ui.js"></script>

<script type="application/javascript" src="<%= basePath%>/modules/leader/js/leader.js"></script>

<div class="body_scroll">
    <div class="frame-content">
        <ul class="info_list">
            <li class="li_footer">
                <table class="sui-table table-zebra attend_table leader_table_body table-bordered">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>教师名称</th>
                        <th>管理班级</th>
                        <th>权限设置</th>
                    </tr>
                    </thead>
                    <tbody>
                    <% teachers.forEach(function(teacher, index) {%>
                    <tr>
                        <td><%=index + 1%></td>
                        <td><%=teacher.name%></td>
                        <td>
                            <%= 
                                teacher.managedClasses.map(function(natureClass) { 
                                    return natureClass.name 
                                }).join(', ')
                            %>
                        </td>
                        <td>
                            <a style="cursor: pointer; text-decoration: none"
                                data-user="<%=teacher.user.id%>"
                                data-is-leader="<%=teacher.user.role.name == 'leaderTeacher'%>"
                            >
                            <%  if ( teacher.user.role.name == 'teacher' ) { %>
                                设置为管理员
                            <% 
                                } 
                                else { %>
                                取消管理员
                            <%  } %>
                            </a>
                        </td>
                    </tr>
                    <% }); %>
                    </tbody>
                </table>
            </li>
        </ul>
    </div>
</div>

<script>
    $(document).ready(function () {

        var isSaving = false;

        $('td').find('a').click(function (event) {
            var currentButton = $(event.currentTarget);
            var isLeader = currentButton.attr('data-is-leader');
            var userID = currentButton.attr('data-user');
            isSaving = true;
            var requestURL = '/leader/user/cancel_leader';
            var buttonHTML = '设置为管理员';
            var data_is_leader = 'false';
            if (isLeader == 'false') {
                console.log('heh');
                requestURL = '/leader/user/grant_leader';
                buttonHTML = '取消管理员';
                data_is_leader = 'true';
            }
            var req = new Request(requestURL);
            req.postJSON({
                user: {
                    id: userID
                }
            }, function (data) {
                isSaving = false;
                if (data.successful) {
                    currentButton.html(buttonHTML);
                    currentButton.attr('data-is-leader', data_is_leader);
                }
                else {
                    alert('操作失败！');
                }
            })
        });
    });
</script>
